import { Route, Routes } from 'react-router-dom'
import './App.css'
import MyLayout from './layout'
import MainPage from './views/mainpage'
import NotFound from './component/notfound'
import RegisterForm from './views/login'
import BookList from './views/speech/firstPage'
import SpeechFirstPage from './views/speech/firstPage'
import SpeechSecondPage from './views/speech/secondPage'
// import SpeechView from './views/speech'
import SentencePage from './views/speech/thirdPage'


function App() {

  return (
      <div>
        <Routes>
          {/* 第一层路由 */}
          <Route path="/" element={<MyLayout />}>
              <Route index element={<MainPage />} />
              <Route path='/mainpage' element={<MainPage/>} />
              <Route path="/speech" element={<BookList />} />
              <Route path="/dialogue/chapter:id" element={<SpeechFirstPage />} /> {/* 新增的动态路由 */}
              <Route path="/dialogue/:bookId/chapter" element={<SpeechSecondPage />} />
              {/* <Route path="/dialogue/:bookId/sentence/:chapterId" element={<SpeechView />} /> */}
              <Route path="/dialogue/:bookId/sentence/:chapterId" element={<SentencePage />} />
          </Route>
          <Route path="/login" element={<RegisterForm />} />
          <Route path="*" element={<NotFound />} />
        </Routes>
    </div>
  )
}

export default App
